<#function _getPageElement name>
	<#return tag.getPageElement(ps, name, _gridModel, _namePrefix)>
</#function>

<#macro line name='' clazz='' style='' width=0 id=''>
	<#local shortName = tag.getShortName(name)>
	<#if shortName != ''>
		<#local _pageElement = _getPageElement(shortName)!>
		<#if _pageElement?is_string>
			<#local _pageElement = ps.addElement('line', shortName, '', false, false, width, true)>
		</#if>
	</#if>
	<span<#if id!=''> id="${id}"</#if> uiType="line" name='${shortName}' fullName='${name}' class="graphLine graph stdEle" style="${style}<#if width!=0>;width:${width}</#if>"></span>
</#macro>

<#macro linev name='' clazz='' style='' height=0 id=''>
	<#local shortName = tag.getShortName(name)>
	<#if shortName != ''>
		<#local _pageElement = _getPageElement(shortName)!>
		<#if _pageElement?is_string>
			<#local _pageElement = ps.addElement('linev', shortName, '', false, false, 0, true)>
		</#if>
	</#if>
	<span<#if id!=''> id="${id}"</#if> uiType="linev" name='${shortName}' fullName='${name}' class="graphLineV graph stdEle" style="${style}<#if height!=0>;height:${height}</#if>"></span>
</#macro>

<#macro rectangle name='' clazz='' style='' width=0 height=0 id=''>
	<#local shortName = tag.getShortName(name)>
	<#if shortName != ''>
		<#local _pageElement = _getPageElement(shortName)!>
		<#if _pageElement?is_string>
			<#local _pageElement = ps.addElement('rectangle', shortName, '', false, false, width, true)>
		</#if>
	</#if>
	<span<#if id!=''> id="${id}"</#if> uiType="rectangle" name='${shortName}' fullName='${name}' style="${style}<#if height!=0>;height:${height}</#if><#if width!=0>;width:${width}</#if>"
		class="graphRectangle graph stdEle"></span>
</#macro>

<#macro image name='' src='' clazz='' style='' showZoom=false width=0 height=0 id=''>
	<#local shortName = tag.getShortName(name)>
	<#if shortName != ''>
		<#local _pageElement = _getPageElement(shortName)!>
		<#if _pageElement?is_string>
			<#local _pageElement = ps.addElement('image', shortName, '', false, false, width, true)>
		</#if>
	</#if>
	<#if src=='' && shortName != ''>
		<#local src=_getValue(shortName)>
	</#if>
	<#local height = tag.css(height, style, 'height')>
	<#local width = tag.css(width, style, 'width')>
	<span <#if id!=''> id="${id}"</#if> uiType="image" name='${shortName}' fullName='${name}' class="graphImage graph stdEle<#if src ==''> empty</#if>"
		 style="${style}<#if height!=0>;height:${height}</#if><#if width!=0>;width:${width}</#if>"><#t>
		
		<img<#if src!=''> src="${tag.getImagePath(src)}"</#if><#t>
			<#if height!=0||width!=0> style="<#if height!=0>height:${height}px;</#if><#if width!=0>width:${width}px</#if>"</#if>/><#t>
	</span>
	
	<#if showZoom>
	<@inject name='graph.image' point='footer' type='script' priority=10 once=true _inner=true>
		<#local scriptPath = tag.getScriptPath('/static/espirit/scripts/jquery.artZoom.js', ps.isMock())>
		getScript("${scriptPath}", true);
		<#local cssPath = tag.getCssPath(ps, '', '/static/espirit/styles/jquery.artZoom.css')>
		getCss("${cssPath}");
		when('$.fn.artZoom', function() {
			$('.graphImage img').artZoom({path:'${base}/static/espirit/styles/artZoom.css'});
		});
	</@inject>
	</#if>
</#macro>

<#macro imageGallery name='' collection=[]>
	<#local shortName = tag.getShortName(name)>
	<#if collection?size == 0 && ps.isMock()>
		<#local collection = [{'href':'#','src':'','imageFileName':'demo'}]>
	</#if>
	<div uiType="imageGallery" name='${shortName}' fullName='${name}' class="imageGallery graph stdEle">
	<#list collection as item>
		<span class="graphImage" <#if item.id?exists> dataId=${item.id}</#if>>
			<#if item.href?exists><a target="_blank" href="${item.href}"></#if>
				<img src="${base}${item.src!}" width="110" height="90">
			<#if item.href?exists></a></#if>
			<#if item.name?exists>
				<div class="desc">${item.name}</div>
			</#if>
		</span>
	</#list>
	</div>
</#macro>

<#assign tmp = ps.safeContext().addCssCategory('common')>